<template>

	<view class="u-page">
		<!-- 搜索头部 -->
		<view class="header">
			<view class="swiperList">
				<uni-swiper-dot :info="list" :current="current"   field="content" mode="default">
				    <swiper :autoplay="autoplay" class="swiper-box"  @change="change">
				        <swiper-item v-for="(item ,index) in banner" :key="index">
				            <view class="swiper-item" >
				                <image :src="item.img" mode=""></image> 
				            </view>
				        </swiper-item>
				    </swiper>
				</uni-swiper-dot>
			</view>
		</view>
			<!-- banner -->
		
		<!-- conctent -->
		<view class="content">
			
			<view class="item-box">
				<u-parse :content="platformInfo" ></u-parse>
				
			</view>
			<view class="item-box">
				<view class="item-lable">创业指导</view>
				<block  v-for="(item,key) in acticles" :key="key">
					<view class="newslist" @click="goPage(item.id)">
					<uni-row class="demo-uni-row" >
						<uni-col :span='20'>
							<view class="demo-layout bg-purple-light"><view class="title">{{item.title}}</view><view class="titleinfo">{{item.info}}</view></view>
						</uni-col>
						<uni-col :span='4'>
						<view class="demo-layout bg-purple-dark"><image src="../../static/icon/cellmore.png" mode=""></image></view>
					    	</uni-col>
					</uni-row>
					</view>
				</block>
			</view>
		</view>
	
	</view>
</template>

<script>
import uParse from '@/components/u-parse/u-parse.vue'

	let App = getApp();
	export default {
		components: {
		    uParse
		  },
		data() {
			return {
				platformInfo: '',
				banner: [],
				acticles:[],
			}
		},
		
		onLoad(e) {
			this.company()
		},
	
		methods: {
			goPage(id){
				console.log('1111')
					uni.navigateTo({
						url:"/pages/yssl/acticlesinfo?id="+id
					})
				
			},
			async company(){
				const banner = await this.GQL({
					"operationName": "allSlSystemBanners",
					"query": "query allSlSystemBanners($filter: SlSystemBannerFilter) { allSlSystemBanners(filter:$filter) { nodes { id img nodeId solt title url status } } }",
					"variables": {"filter": {"status": {"equalTo": "1"},"type":{"equalTo":"2"}}}
				})
				console.log('1--',banner)
				if(banner.data.allSlSystemBanners.nodes !=''){
					this.banner = banner.data.allSlSystemBanners.nodes
				}
				//获取平台图文信息
				const platformInfo = await this.GQL({
					"operationName": "allSlSystemConfigs",
					"query": "query allSlSystemConfigs($filter: SlSystemConfigFilter) { allSlSystemConfigs(filter: $filter) { nodes { id platformInfo menuName } } }",
					"variables": {"filter": {"menuName": {"equalTo": "site_name"}}}
				})
				if(platformInfo.data.allSlSystemConfigs.nodes !=''){
					this.platformInfo = platformInfo.data.allSlSystemConfigs.nodes[0].platformInfo
				}
				//获取创业新闻信息
				const articles = await this.GQL({
					"operationName": "allSlSystemArticles",
					"query": "query allSlSystemArticles($filter: SlSystemArticleFilter) { allSlSystemArticles(filter: $filter) { nodes { id info title } } }",
					"variables": {"filter": {"type": {"equalTo": "2"}}}
				})
				if(articles.data.allSlSystemArticles.nodes !=''){
					this.acticles = articles.data.allSlSystemArticles.nodes 
				}
				
				
				
			}
		}
	}
</script>

<style lang="scss">
	
	.u-page{
		background-color: #f0f2f5;
	}
	/* 头部 */
	.header{
		width: 100%;
		height: 185px;
		/* color: #FFFFFF; */
		background: linear-gradient(#C7171E, #f0f2f5); /* 标准的语法 */
		
	}
	.swiperList{
		position: relative;
		height: 100rpx;
		margin: 0px 15px;
		// margin: 15px 15px 30px 15px;
		.uni-swiper__warp {
			border-radius: 10px;
		}
		
		.swiper-box{
			height: 300rpx;
			.swiper-item{
				border-radius: 10px;
				image{
					width: 100%;
					height: 300rpx;
				}
			}
		}
	}
	.content{
		margin: 0px 15px;
		background: #FFFFFF;
		border-radius: 10px;
		.item-box{
			padding: 10px 0px;
			.item-lable{
				font-size: 16px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 600;
				color: #161E3E;
				line-height: 16px;
			}
		}
		.newslist{
			border-bottom: 1px solid #D7D7D7;
				// margin:0px 15px;
				.bg-purple{
					display:flex;
					align-items:center;
					justify-content:center;
					height: 50px;
				}
				.bg-purple image{
					width: 61px;
					height: 60px;
				}
				.bg-purple-light{
					height: 50px;
				}
				
				.title{
					padding-top:18px ;
					font-size: 14px;
					color: #161E3E;
					font-weight: 400;
				}
				.titleinfo{
					margin-top: 5px;
					font-size: 12px;
					font-weight: 200;
					color: #9BA7C1;
				}
				.bg-purple-dark{
					display:flex;
					align-items:flex-end;
					height: 65px;
					image{
						width: 20px;
						height: 20px;
					}
				}
			}
	}
	
	
	
</style>
